<template>
  <VDialog @close="handleClose" @save="save" :loading="loading" width="720">
    <template #content>
      <el-checkbox-group v-model="checkList">
        <el-checkbox :label="item.value" v-for="item in options" :key="item">
          {{ item.label }}
        </el-checkbox>
      </el-checkbox-group>
    </template>
  </VDialog>
</template>
<script setup>
import { ElMessage } from "element-plus";
import { currencySetting } from "../../../api";
const emit = defineEmits(["update:modelValue", "close", "refresh"]);
const props = defineProps({
  data: { type: Object, default: () => {} },
  options: { type: Array, default: () => [] },
});
const { options } = toRefs(props);
const checkList = ref([]);
watch(
  () => props.data,
  (val) => {
    if (val) {
      checkList.value = val;
    }
  }
);
const save = async () => {
  const { code, message } = await currencySetting({
    currency: checkList.value,
  });
  if (code != 200) return ElMessage.warning(message);
  ElMessage.success("更新成功");
  handleClose(true);
};
const handleClose = async (refresh) => {
  checkList.value = [];
  emit("update:modelValue", false);
  emit("close");
  if (refresh) emit("refresh");
};
</script>

<style scoped lang="scss"></style>
